/*
 * Copyright 2017 The boardgame.io Authors
 *
 * Use of this source code is governed by a MIT-style
 * license that can be found in the LICENSE file or at
 * https://opensource.org/licenses/MIT.
 */

.gamelog {
  display: grid;
  grid-template-columns: 30px 1fr 30px;
  grid-auto-rows: auto;
  grid-auto-flow: column;
}

.gamelog .turn-marker {
  display: flex;
  justify-content: center;
  align-items: center;
  grid-column: 1;
  background: #555;
  color: #eee;
  text-align: center;
  font-weight: bold;
  border: 1px solid #888;
}

.gamelog .log-event {
  grid-column: 2;
  cursor: pointer;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #fff;
  border: 1px dotted #ccc;
  border-left: 5px solid #ccc;
  padding: 5px;
  text-align: center;
  color: #888;
  font-size: 14px;
  min-height: 25px;
  line-height: 25px;
}

.gamelog .phase-marker {
  grid-column: 3;
  background: #555;
  border: 1px solid #888;
  color: #eee;
  text-align: center;
  font-weight: bold;
  padding-top: 10px;
  padding-bottom: 10px;
  text-orientation: sideways;
  writing-mode: vertical-rl;
  line-height: 30px;
  width: 100%;
}

.gamelog.pinned .log-event {
  opacity: 0.2;
}

.gamelog .log-event:hover {
  border-style: solid;
  background: #eee;
}

.gamelog .log-event.pinned {
  border-style: solid;
  background: #eee;
  opacity: 1;
}

.gamelog div.player0 {
  border-left-color: #ff851b;
}

.gamelog div.player1 {
  border-left-color: #7fdbff;
}

.gamelog div.player2 {
  border-left-color: #0074d9;
}

.gamelog div.player3 {
  border-left-color: #39cccc;
}

.gamelog div.player4 {
  border-left-color: #3d9970;
}

.gamelog div.player5 {
  border-left-color: #2ecc40;
}

.gamelog div.player6 {
  border-left-color: #01ff70;
}

.gamelog div.player7 {
  border-left-color: #ffdc00;
}

.gamelog div.player8 {
  border-left-color: #001f3f;
}

.gamelog div.player9 {
  border-left-color: #ff4136;
}

.gamelog div.player10 {
  border-left-color: #85144b;
}

.gamelog div.player11 {
  border-left-color: #f012be;
}

.gamelog div.player12 {
  border-left-color: #b10dc9;
}

.gamelog div.player13 {
  border-left-color: #111111;
}

.gamelog div.player14 {
  border-left-color: #aaaaaa;
}

.gamelog div.player15 {
  border-left-color: #dddddd;
}
